<style>
    .panel {
        width: 1240px;
        margin: auto;
    }

    .title {
        display: flex;
        padding-top: 4px;
        align-items: center;
        margin-bottom: 30px;
    }

    .setting {
        text-align: left !important;
        cursor: pointer;
        color: #1a96ff;
    }

    .red {
        color: red;
    }

    .settypes {
        display: inline-block;
    }

    .settypes label {
        margin-right: 15px;
    }

    .upds, .upds:hover, .upds:focus, .upds:active {
        width: 100%;
        color: #fff;
        background: #1a96ff;
    }

    .infos {
    }

    .infos div {
        color: #999;
        margin-left: 4px;
        display: flex;

    }

    .infos-p {
        margin-left: 14px !important;
    }

    .infos-p a {
        color: #1a96ff;

    }

    .tags {
        padding: 20px;

    }

    .tags1 {
        display: inline-block;
        width: 29%;
        vertical-align: top;
    }

    .tags2 {
        display: inline-block;
        width: 60%;
        margin-left: 5%;
    }

    .tags2 a, .tags2 a:hover {
        padding: 2px 30px;
        border: 1px solid #4e73df;
        margin-top: 20px;
        display: inline-block;
    }

    .weixn, .qiye {
        display: none;
    }

    .content-title {

    }

    .content-title-dian {
        background: #4e73df;
        width: 5px;
        height: 5px;
        border-radius: 100%;
        display: inline-block;
        vertical-align: middle;
        margin-right: 5px;
    }

    .content-title-num {
        color: #4e73df;
    }

    .content-bar {
        overflow: scroll;
    }

    .content table {
        border: 1px solid #bfbfbf;
        border-collapse: collapse
    }

    .content table td {
        border: 1px solid #bfbfbf;
        padding: 10px 20px;
    }

    .others {
        padding: 20px;
        box-shadow: 0 2px 8px 0 rgba(31, 50, 98, 0.13);
        border-radius: 3px;
        border: 1px solid #e1eaf7;
        padding-bottom: 60px;
    }

    .content button {
        /*padding: 5px 40px;*/
        /*margin: 10px;*/
    }

    .content .layer-footer {
        text-align: center;
        margin-top: 20px;
    }

    .content-previewsend {
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: #fff;
    }

    .phone-preview {
        width: 33%;
        margin-right: 50px;
        display: flex;
        justify-content: flex-end;
    }

    .preview-set {
        width: 50%;
        margin-left: 40px;
        margin-top: -10px;
        height: 100%;
    }

    .contents-preview {
        width: 266px;
        overflow: hidden;
        box-shadow: 0 8px 18px 0 rgba(104, 113, 168, 0.28);
        border-radius: 8px;
        border: 1px solid #ebebeb;
    }

    .contents-preview .preview_head {
        display: flex;
        width: 100%;
        margin-top: 14px;
        margin-bottom: 16px;
        align-items: center;
        justify-content: center;
    }

    .contents-preview .title {
        text-align: center;
        font-size: 12px;
        font-weight: 400;
        color: #2a2d3f;
        line-height: 17px;
        margin-bottom: 0;
    }

    .preview_title {
        width: 246px;
        height: 128px;
        margin: 10px;
        background-size: 100% 100%;
        background-image: url(__CDN__/assets/addons/kupay/img/info1.png);
        border-radius: 8px;
        justify-content: center;
    }

    .preview_title .tip1 {
        height: 17px;
        font-size: 12px;
        font-weight: 400;
        color: #fff;
        line-height: 17px;
        text-align: center;
        padding-top: 20px;
    }

    .preview_title .tip2 {
        height: 28px;
        font-size: 20px;
        font-weight: 500;
        color: #fff;
        line-height: 28px;
        text-align: center;
        margin-top: 20px;
    }

    .preview_title .tip3 {
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        display: -webkit-box;
        font-size: 12px;
        font-weight: 400;
        text-align: center;
        margin-top: 10px;
        margin-left: 20px;
        margin-right: 20px;
        color: #f2f3fc;
        margin-bottom: 10px;
    }

    .preview_body {
        overflow-y: auto;
        height: 312px;
    }

    .preview_body .company-info-item1 {
        align-items: center;
        display: flex;
        margin-bottom: 10px;
    }

    .preview_body .tip {
        width: 3px;
        height: 10px;
        background: #1a96ff;
        border-radius: 2px;
        margin-left: 14px;
    }

    .preview_body .tip4, .preview_body .tip_lable {
        height: 17px;
        font-size: 12px;
        color: #030303;
    }

    .preview_body .tip_lable {
        margin-left: 6px;
        font-weight: 500;
    }

    .preview_body .company-info-item {
        height: 40px;
        align-items: center;
        display: flex;
        margin-left: 14px;
        margin-right: 14px;
        border-bottom: 1px solid rgba(0, 0, 0, .1);
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    .preview-tip {
        font-size: 16px;
        font-weight: 400;
        color: #333;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 20px;
    }

    .preview-set-one {
        min-height: 450px;
    }

    .content-previewsend .company-info-item2 {
        align-items: center;
        display: flex;
        justify-content: left;
    }

    .content-previewsend .company-info-item2 {
        align-items: center;
        display: flex;
    }

    .content-previewsend .company-info-item2 .tip_lable {
        border-radius: 6px;
        margin-left: 6px;
    }

    .content-previewsend .company-info-item2 .tip {
        width: 4px;
        height: 15px;
        background: #1a96ff;
        border-radius: 2px;
    }

    .content-previewsend .company-info-item .tip {
        width: 4px;
        height: 15px;
        background: #1a96ff;
        border-radius: 2px;
    }

    .content-previewsend .company-info-item .tip_lable {
        border-radius: 6px;
        margin-left: 6px;
    }

    .content-previewsend .company-info-item {
        align-items: center;
        display: flex;
        justify-content: left;
    }

    .content-previewsend .company-info-item .tip_lable1 {
        font-size: 14px;
        font-weight: 400;
        color: #1f1f1f;
    }

    .el-textarea {
        position: relative;
        display: inline-block;
        width: 100%;
        vertical-align: bottom;
        font-size: 14px;
    }

    .el-textarea__inner {
        display: block;
        resize: vertical;
        padding: 5px 15px;
        line-height: 1.5;
        box-sizing: border-box;
        width: 100%;
        font-size: inherit;
        color: #606266;
        background-color: #fff;
        background-image: none;
        border: 1px solid #dcdfe6;
        border-radius: 4px;
        transition: border-color .2s cubic-bezier(.645, .045, .355, 1);
    }

    .el-textarea .el-input__count {
        color: #909399;
        background: #fff;
        position: absolute;
        font-size: 12px;
        bottom: 5px;
        right: 10px;
    }

    .footer-btn {
        display: flex;
        margin-top: 20px;
        justify-content: flex-start;
        align-items: center;
    }

    .salary-button.default {
        color: #1a96ff;
        background-color: #fff;
        border-color: #1a96ff;
    }

    .salary-button {
        padding: 0 0;
        height: 36px;
        line-height: 36px;
        box-sizing: border-box;
        border: 1px solid #fff;
        text-align: center;
        color: #1a96ff;
        border-radius: 2px;
        font-size: 16px;
        font-weight: 400;
        cursor: pointer;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

    .footer-btn div {
        margin-left: 20px;
    }

    .salary-button.primary {
        color: #fff;
        background-color: #1a96ff;
        border-color: #1a96ff;
    }

    .el-dialog__wrapper {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        overflow: auto;
        margin: 0;
        background: rgba(0, 0, 0, 0.18);
    }

    .confirm-dialog {
        background: #fff;
        box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.1);
        border-radius: 6px;
    }

    .el-dialog {
        border-radius: 6px !important;
    }

    .el-dialog {
        position: relative;
        margin: 0 auto 50px;
        background: #fff;
        border-radius: 2px;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
        box-sizing: border-box;
        width: 50%;
    }

    .confirm-dialog .el-dialog__header {
        padding: 16px 20px 6px;
    }

    .el-dialog__title {
        line-height: 24px;
        font-size: 18px;
        color: #303133;
    }

    .el-dialog__headerbtn {
        position: absolute;
        top: 20px;
        right: 20px;
        padding: 0;
        background: 0 0;
        border: none;
        outline: 0;
        cursor: pointer;
        font-size: 16px;
    }

    .layui-layer-close1:after {
        content: "\e626";
        font-family: iconfont;
        font-style: normal;
        font-weight: normal;
        text-decoration: inherit;
        position: absolute;
        font-size: 18px;
        color: #fff;
        margin: 0;
        z-index: 1;
    }

    .confirm-dialog .el-dialog__body {
        padding: 0 0 0 !important;
    }

    .el-dialog__body {
        padding: 30px 20px;
        color: #606266;
        font-size: 14px;
        word-break: break-all;
    }

    .devider {
        margin-top: 16px;
        height: 1px;
        background: #e8eaea;
        border: 1px #e8eaea;
    }

    .title {
        margin-top: 22px;
        text-align: center;
        height: 20px;
        font-size: 16px;
        font-weight: 600;
        color: #333;
        line-height: 20px;
    }

    .dialog-body {
        width: 94%;
        height: auto;
        background: #f4f6ff;
        border-radius: 4px;
        margin: 30px auto 0;
        display: flex;
        box-sizing: border-box;
        justify-content: flex-start;
        padding-top: 20px;
    }

    .dialog-body .wx-img {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        position: relative;
        padding-top: 29px;
    }

    .dialog-body .wx-img.only-wx {
        margin: 0 29px 0 130px;
    }

    .dialog-body .wx-img div.img {
        width: 134px;
        height: 134px;
        box-sizing: border-box;
        border: 1px solid #ccc;
        border-radius: 10px;
        overflow: hidden;
    }

    .dialog-body .wx-img div.img img {
        width: 100%;
        height: 100%;
        display: block;
    }

    .dialog-body .wx-img div.btn {
        width: 134px;
        height: 34px;
        margin-top: 40px;
        text-align: center;
        background: #1a96ff;
        border-radius: 2px;
        font-size: 14px;
        font-weight: 400;
        color: #fff;
        cursor: pointer;
        margin-bottom: 30px;
    }

    .dialog-body .wx-img div.tip-message {
        position: absolute;
        bottom: 12px;
        width: 241px;
        height: 62px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .dialog-body .wx-img div.tip-message .bubbles {
        width: 100%;
        height: 100%;
    }

    .dialog-body .wx-img div.tip-message .tip3 {
        position: absolute;
        top: 50%;
        left: 50%;
        margin-left: -100px;
        margin-top: -20px;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 200px;
        height: 40px;
        font-size: 14px;
        font-weight: 400;
        color: #6a6d82;
    }

    .dialog-body .content {
        margin-left: 30px;
        padding-right: 17px;
        background-color: transparent !important;
        min-height: 270px;
    }

    .dialog-body .content .tip1 {
        font-size: 16px;
        font-weight: 600;
        color: #333;
        margin-bottom: 10px;
    }

    .dialog-body .content .tip2 {
        font-size: 14px;
        font-weight: 400;
        color: #666;
        line-height: 22px;
    }

    .devider {
        margin-top: 16px;
        height: 1px;
        background: #e8eaea;
        border: 1px #e8eaea;
    }

    .confirm-dialog .el-dialog__footer {
        padding: 20px 30px;
        height: 70px;
        background: #fff;
        border-radius: 6px;
        text-align: right;
    }

    .confirm-dialog .el-button--default {
        background: #fff;
        border-radius: 4px;
        border: 1px solid #1a96ff;
        font-size: 14px;
        font-weight: 400;
        color: #1a96ff;
        width: 60px;
        height: 30px;
        line-height: 30px;
        box-sizing: border-box;
        padding: 0;
        margin-right: 20px;
    }

    .confirm-dialog .el-button--primary {
        background: #1a96ff;
        border-radius: 2px;
        border: 1px solid #1a96ff;
        font-size: 14px;
        font-weight: 400;
        color: #fff;
        width: 60px;
        height: 30px;
        line-height: 30px;
        box-sizing: border-box;
        padding: 0;
    }

    #tishik {
        display: none;
    }

    .body-result {
        margin-top: 20px;
        align-items: center;
        margin: 0 auto;
        min-height: 558px;
        background: #fff;
    }

    .content-item {
        width: 1050px;
        background: #f4f6ff;
        margin: 60px auto 0;
        padding: 25px 0 32px calc(50% - 290px);
        box-sizing: border-box
    }

    .content-item .content-tip {
        height: 22px;
        font-size: 16px;
        font-weight: 600;
        color: #333;
        margin-bottom: 10px
    }

    .content-item .content-text {
        margin-bottom: 30px
    }

    .content-item .content-text div {
        font-size: 14px;
        font-weight: 400;
        color: #666;
        line-height: 24px
    }

    .content-item .img-container {
        justify-content: flex-start;
        align-items: flex-end
    }

    .content-item .img-container .wx-img {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center
    }

    .content-item .img-container .wx-img:first-child {
        margin: 0 50px 0 7px
    }

    .content-item .img-container .wx-img img {
        width: 134px;
        height: 133px;
        display: block;
        border-radius: 8px;
        border: 1px solid #bbbdc7;
        padding: 5px;
        box-sizing: border-box
    }

    .content-item .img-container .wx-img div {
        width: 140px;
        margin-top: 10px
    }

    .content-item .img-container .tip3 {
        font-size: 14px;
        font-weight: 400;
        color: #3e404c;
        line-height: 20px;
        padding: 11px 15px 11px 20px;
        background-color: #fff;
        border: 1px solid #dadbe4;
        position: relative;
        border-radius: 5px;
        margin-left: 15px;
        margin-bottom: -17px
    }

    .content-item .img-container .tip3:before {
        content: "";
        position: absolute;
        width: 16px;
        height: 16px;
        left: -8px;
        background-color: #fff;
        border: 1px solid #dadbe4;
        top: 50%;
        transform: translateY(-50%) rotate(45deg)
    }

    .content-item .img-container .tip3:after {
        content: "";
        position: absolute;
        width: 16px;
        height: 30px;
        background-color: #fff;
        top: 50%;
        transform: translateY(-50%);
        left: 0
    }

    .loading-icon {
        margin-left: 8px;
        -webkit-animation: loadingTurn 1s linear infinite;
        animation: loadingTurn 1s linear infinite
    }

    @-webkit-keyframes loadingTurn {
        0% {
            -webkit-transform: rotate(0deg)
        }
        25% {
            -webkit-transform: rotate(90deg)
        }
        50% {
            -webkit-transform: rotate(180deg)
        }
        75% {
            -webkit-transform: rotate(270deg)
        }
        to {
            -webkit-transform: rotate(1turn)
        }
    }

    @keyframes loadingTurn {
        0% {
            -webkit-transform: rotate(0deg)
        }
        25% {
            -webkit-transform: rotate(90deg)
        }
        50% {
            -webkit-transform: rotate(180deg)
        }
        75% {
            -webkit-transform: rotate(270deg)
        }
        to {
            -webkit-transform: rotate(1turn)
        }
    }

    .company-info-item {
        align-items: center;
        display: flex;
        justify-content: center;
        padding-top: 18px;
    }

    .footer-btn {
        margin-top: 30px;
        align-items: center;
        display: flex;
        justify-content: center;
    }

    .content-item .img-container {
        justify-content: flex-start;
        align-items: flex-end;
    }

    .flex {
        display: flex;
    }

    .xinxis label {
        padding: 0;
        text-align: right;
    }

    .progress {
        align-items: center;
        margin: 0 auto;
        background: #fff;
        padding-bottom: 30px;
        padding-top: 16px;
        height: auto;
    }

    .justify-center {
        justify-content: center;
    }

    .align-center {
        align-items: center;
    }

    .progress-one img {
        width: 36px;
        height: 36px;
    }

    .progress-tip {
        height: 20px;
        font-size: 14px;
        font-weight: 400;
        color: #666;
        line-height: 20px;
        margin-left: 10px;
    }

    .progress-devider {
        width: 64px;
        height: 1px;
        background: #e6e9ed;
        border-radius: 1px;
        margin-left: 16px;
        margin-right: 16px;
    }

    .title .devider {
        margin-left: 30px;
        width: 4px;
        height: 16px;
        margin-top: 0;
        background: #1a96ff;
    }

    .title-name {
        height: 22px;
        font-size: 18px;
        font-weight: 500;
        color: #333;
        line-height: 22px;
        margin-left: 6px;
    }

    #results, #shows, #table-list,.el-textarea,#sendtimes,#sendsout {
        display: none;
    }

    .el-dialog__body .title {
        display: block;
    }
    .announcement{
        color: #333;
        font-size: 14px;
        display: none;
    }
    .dropdown-toggle{
        width: 200px;
    }
    #sendtimes .form-control{
        width: auto;
    }
    .sor-table{
        width: 100%;
        overflow: scroll;
        height:35vh;
        margin-bottom: 20px;
        border: 1px solid #f9f9f9;
    }
</style>


<div class="panel panel-default panel-intro">

    <div class="panel-body">
        <div id="myTabContent" class="tab-content">
            <div class="tab-pane fade active in" id="one">
                <div class="widget-body no-padding">
                    <div id="toolbar" class="toolbar">
                        <div>
                            <div class="progress">
                                <div class="title">
                                    <div class="devider"></div>
                                    <div class="title-name">新建工资条</div>
                                </div>
                                <div class="flex align-center justify-center">
                                    <div class="progress-one flex align-center "><img
                                            src="__CDN__/assets/addons/kupay/img/bar1_2.png" id="imgs1">
                                        <div class="progress-tip">上传工资表</div>
                                        <div class="progress-devider"></div>
                                    </div>
                                    <div class="progress-one flex align-center"><img
                                            src="__CDN__/assets/addons/kupay/img/bar2_1.png" id="imgs2">
                                        <div class="progress-tip">核对数据</div>
                                        <div class="progress-devider"></div>
                                    </div>
                                    <div class="progress-one flex align-center"><img
                                            src="__CDN__/assets/addons/kupay/img/bar3_1.png" id="imgs3">
                                        <div class="progress-tip-done">预览发送</div>
                                        <div class="progress-devider"></div>
                                    </div>
                                    <div class="progress-one flex align-center"><img

                                            src="__CDN__/assets/addons/kupay/img/bar4_1.png" id="imgs4">
                                        <div class="progress-tip">发送结果</div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <hr>

                        <form id="add-form" class="form-horizontal zhanshi" role="form" data-toggle="validator"
                              method="POST"
                              action="">

                            <div class="form-group">
                                <label class="control-label col-xs-12 col-sm-4">{:__('发薪类型')}:</label>
                                <div class="col-xs-12 col-sm-4">
                                    <select id="c-pid" data-rule="required" class="form-control selectpicker"
                                            name="row[type]">
                                        {foreach name="paytype" item="vo"}
                                        <option value="{$vo.name}">{$vo.name}</option>
                                        {/foreach}
                                    </select>
                                </div>
                                <span class=" control-label col-xs-12 col-sm-1 setting"  >设置</span>
                            </div>
                            <div class="form-group">
                                <label class="control-label col-xs-12 col-sm-4">发薪时间:</label>
                                <div class="col-xs-12 col-sm-4">
                                    <input id="c-timingtime" class="form-control datetimepicker"
                                           data-date-format="YYYY-MM" data-use-current="true" name="row[timingtime]"
                                           type="text" value="{:date('Y-m',strtotime('-1 months'))}">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="control-label col-xs-12 col-sm-4"><span class="red">*</span>发送方式:</label>
                                <div class="col-xs-12 col-sm-4 settypes">
                                    <label class="control-label" for="key1"><input id="key1" class="ipt"
                                                                                   name="row[settype][]"
                                                                                   type="checkbox" value="1"/>
                                        微信</label>
                                    <label class="control-label" for="key4"><input id="key4" class="ipt"
                                                                                   name="row[settype][]"
                                                                                   type="checkbox" value="4"/>
                                        短信</label>
                                </div>
                            </div>
                            <div class="form-group weixn">
                                <label class="control-label col-xs-12 col-sm-4"></label>
                                <div class="col-xs-12 col-sm-4 tags">
                                    <div class="tags1">
                                        <img src="{$weixin.image|default=''}" width="100%">
                                    </div>
                                    <div class="tags2">
                                        <div>
                                            员工需要先关注对应公众号，否则接收不到哦~
                                        </div>
                                        <a type="button" href="{$weixin.image|default=''}" download="二维码">下载二维码</a>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group layer-footer">
                                <label class="control-label col-xs-12 col-sm-4"></label>
                                <div class="col-xs-12 col-sm-4">
                                    <button disabled="disabled" type="button" id="btn-myimport-file"
                                            class="btn  plupload upds"
                                            data-input-id="c-avatar" data-mimetype="xls,xlsx" data-multiple="false"
                                            data-preview-id="p-avatar">上传工资表
                                    </button>
                                </div>
                            </div>
                            <div class="form-group layer-footer">
                                <label class="control-label col-xs-12 col-sm-4"></label>
                                <div class="col-xs-12 col-sm-4 infos">
                                    <div><span class="red">*</span>
                                        <div> 请上传Excel格式的工资表（需包含姓名和手机号）</div>
                                        <br></div>

                                    <div class="infos-p"> 您可以上传自定义模板；没有模板？<a href="__CDN__/assets/addons/kupay/template/gzt.xlsx">点击下载</a></div>

                                </div>
                            </div>
                        </form>
                        <div class="content zhanshi" id="table-list">
                            <div class="content-title"><span class="content-title-dian"></span>系统已智能识别到<span
                                    class="content-title-num"></span>条工资条记录
                            </div>
                            <div class="sor-table">
                                <table id="table" class="table table-striped table-bordered table-hover table-nowrap">
                                    <tr id="content-bar">

                                    </tr>
                                </table>
                            </div>

                            <div class="others">
                                <div class="others-title"><img src="__CDN__/assets/addons/kupay/img/zhin.png" width="15px">智能匹配工资数据
                                </div>
                                <form>
                                    <div class="form-group xinxis">
                                        <label class="control-label col-xs-12 col-sm-1"><span class="red">*</span>员工姓名:</label>
                                        <div class="col-xs-12 col-sm-2">
                                            <select id="others-name" data-rule="required"
                                                    class="form-control selectpicker others-sel"
                                                    name="row[others-name]">
                                            </select>
                                        </div>
                                        <label class="control-label col-xs-12 col-sm-1"><span
                                                class="red">*</span>手机号:</label>
                                        <div class="col-xs-12 col-sm-2">
                                            <select id="others-phone" data-rule="required"
                                                    class="form-control selectpicker others-sel"
                                                    name="row[others-phone]">
                                            </select>
                                        </div>
                                        <label class="control-label col-xs-12 col-sm-1"><span class="red">*</span>实发工资:</label>
                                        <div class="col-xs-12 col-sm-2">
                                            <select id="others-price" data-rule="required"
                                                    class="form-control selectpicker others-sel"
                                                    name="row[others-price]">
                                            </select>
                                        </div>
                                        <label class="control-label col-xs-12 col-sm-1">邮箱:</label>
                                        <div class="col-xs-12 col-sm-2">
                                            <select id="others-email" data-rule="required"
                                                    class="form-control selectpicker others-sel"
                                                    name="row[others-email]">
                                            </select>
                                        </div>

                                    </div>
                                </form>
                            </div>
                            <div class="footer-btn">
                                <div class="salary-button default chongxin" style="width: 89px;">重新上传</div>
                                <div class="salary-button primary next" style="width: 89px;">下一步</div>
                            </div>
                        </div>
                        <div class="content-previewsend zhanshi" id="shows">
                            <div class="phone-preview">
                                <div class="contents-preview">
                                    <div class="preview_head">
                                        <div class="title" id="xintime"></div>
                                    </div>
                                    <div class="preview_title">
                                        <div class="tip1">实发工资(元)</div>
                                        <div class="tip2" id="shiji"></div>
                                        <div class="tip3">{$company.company|default=''}</div>
                                    </div>
                                    <div class="preview_body scroll" id="preview_body">
                                        <div class="company-info-item1 announcement" style="display: none">
                                            <div class="tip"></div>
                                            <div class="tip_lable">公告</div>
                                        </div>
                                        <div class="company-info-item1 announcement" style="display: none">
                                            <div id="announcement" style="padding: 0 14px;width: 100%;word-break:break-all"> </div>
                                        </div>
                                        <div class="company-info-item1">
                                            <div class="tip"></div>
                                            <div class="tip_lable">工资明细</div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div style="width: 1px; height: 460px; background: rgb(230, 230, 233);"></div>
                            <div class="preview-set">
                                <form  class="form-horizontal" role="form" data-toggle="validator"
                                       method="POST"
                                       action="">

                                    <div class="preview-set-one">
                                        <div class="company-info-item2">
                                            <div class="tip"></div>
                                            <div class="tip_lable">显示设置</div>
                                        </div>
                                        <div class="company-info-item">
                                            <span class="tip_lable1">隐藏数据:</span>
                                            <div class="el-select no-height"
                                                 style="margin-left: 10px; margin-right: 16px;width: 200px">
                                                <select  id="c-flag"  class="form-control selectpicker" multiple="" name="row[flag][]">
                                                    <option value="请选择">请选择</option>
                                                </select>
                                            </div>
                                            <img src="__CDN__/assets/addons/kupay/img/gantan.png">
                                            <span class="tip_lable2">被隐藏的项将不会显示在工资条中</span>
                                        </div>
                                        <div class="company-info-item"><span class="tip_lable1">显示空值</span>
                                            <div class="el-switch" style="margin-left: 14px; margin-right: 16px;">
                                                <input id="c-switch" name="row[switch]" type="hidden" value="0">
                                                <a href="javascript:;" data-toggle="switcher" class="btn-switcher"
                                                   data-input-id="c-switch" data-yes="1" data-no="0" id="c-switch_1">
                                                    <i class="fa fa-toggle-on text-successfa-flip-horizontal text-gray fa-2x fa-flip-horizontal"></i>
                                                </a>

                                                <span class="el-switch__core" style="width: 40px;"></span>
                                            </div>
                                            <img src="__CDN__/assets/addons/kupay/img/gantan.png">
                                            <span class="tip_lable2">开启后工资条中将展示数值为空的项目</span>
                                        </div>
                                        <div class="company-info-item"><span
                                                class="tip_lable1">添加公告</span>
                                            <div class="el-switch"
                                                 style="margin-left: 14px; margin-right: 16px;">
                                                <input id="c-switch1" name="row[switch]" type="hidden" value="0">
                                                <a href="javascript:;" data-toggle="switcher" class="btn-switcher"
                                                   data-input-id="c-switch1" data-yes="1" data-no="0" id="c-switch1_1">
                                                    <i class="fa fa-toggle-on text-successfa-flip-horizontal text-gray fa-2x fa-flip-horizontal"></i>
                                                </a>
                                                <span class="el-switch__core" style="width: 40px;"></span>
                                            </div>
                                            <img src="__CDN__/assets/addons/kupay/img/gantan.png">
                                            <div class="tip_lable2">手机查看时，公告将显示在工资条底部</div>
                                        </div>
                                        <div class="textarea el-textarea" style="margin-top: 20px;">
                                        <textarea autocomplete="off" placeholder="请输入内容" maxlength="70"
                                                  class="el-textarea__inner"
                                                  style="min-height: 40px;"></textarea></div>
                                        <div class="company-info-item">
                                            <div class="tip"></div>
                                            <div class="tip_lable">功能设置</div>
                                        </div>
                                        <div class="company-info-item"><span class="tip_lable1">定时发送</span>
                                            <div class="el-switch" style="margin-left: 14px; margin-right: 16px;">
                                                <input id="c-switch2" name="row[switch]" type="hidden" value="0">
                                                <a href="javascript:;" data-toggle="switcher" class="btn-switcher"
                                                   data-input-id="c-switch2" data-yes="1" data-no="0" id="c-switch2_1">
                                                    <i class="fa fa-toggle-on text-successfa-flip-horizontal text-gray fa-2x"></i>
                                                </a>
                                                <span class="el-switch__core" style="width: 40px;"></span>
                                            </div>
                                        </div>
                                        <div class="company-info-item" id="sendtimes"><span class="tip_lable1">发送时间</span>
                                            <div class="el-date-editor el-input el-input--prefix el-input--suffix el-date-editor--date"
                                                 style=" margin-left: 14px; margin-right: 16px;">
                                                <input id="c-date" class="form-control datetimepicker"
                                                       data-date-format="YYYY-MM-DD" data-use-current="true"
                                                       name="row[timingtime]"
                                                       type="text" value="{:date('Y-m-d')}">
                                                <input id="c-time" class="form-control datetimepicker"
                                                       data-date-format="HH:mm" data-use-current="true"
                                                       name="row[timingtime]"
                                                       type="text" value="{:date('H:s')}">
                                            </div>

                                        </div>
                                    </div>
                                    <div class="footer-btn">
                                        <div class="salary-button default" id="back" style="width: 89px;">上一步</div>
                                        <div class="salary-button primary" id="sendout" style="width: 89px;">发送</div>
                                    </div>
                                </form>
                            </div>
                            <div id="tishik">
                                <div class="el-dialog__wrapper" height="700px"
                                     style="z-index: 2016;">
                                    <div role="dialog" aria-modal="true" aria-label="提示"
                                         class="el-dialog confirm-dialog" style="margin-top: 15vh; width: 796px;">
                                        <div class="el-dialog__header"><span class="el-dialog__title">提示</span>
                                            <button type="button" aria-label="Close" class="el-dialog__headerbtn"><i class="fa fa-times quxias" aria-hidden="true"></i></button>
                                        </div>
                                        <div class="el-dialog__body">
                                            <div class="devider"></div>
                                            <div class="title">您将发送<span class="tantimes"></span>的工资条，是否确定继续?</div>

                                            <div class="dialog-body">
                                                <div class="wx-img only-wx">
                                                    <div class="img"><img
                                                            src="{$weixin.image|default=''}"></div>
                                                    <div class="btn"> 下载公众号二维码</div>
                                                    <div class="tip-message" style="right: -294px;">
                                                        <img
                                                                src="__CDN__/assets/addons/kupay/img/tishik.png" class="bubbles">
                                                        <div class="tip3"> 下载后将二维码群发给同事<br
                                                        >让同事可以通过微信查看工资条
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="content">
                                                    <div class="tip1">员工如何查看工资条？</div>
                                                    <div class="tip2">
                                                        微信：员工先关注对应微信公众号，发送工资条后，通过微信查看工资条;<br>
                                                        短信：员工通过短信接收工资条，查看工资条;<br>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="devider"></div>
                                        </div>
                                        <div class="el-dialog__footer"><span><button
                                                type="button"
                                                class="el-button el-button--default el-button--medium quxias">
                                            <span>取消</span></button><button type="button" id="qurest"
                                                                            class="el-button confirm common-button el-button--primary el-button--medium">
                                            <span>确认</span></button></span></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="body-result zhanshi" id="results">
                            <div class="company-info-item" id="sendsin4"><span class="lable">预约发送：<span id="sendsnum4"></span>条</span>
                                <span class="lable">发送时间：<span id="sendsnum5"></span></span></div>
                            <div class="company-info-item" id="sendsin"><span class="lable">正在发送中：<span id="sendsnum1"></span>条</span><img

                                    src="__CDN__/assets/addons/kupay/img/zhuanquan.png"
                                    width="17" height="17" alt="" class="loading-icon"></div>
                            <div class="company-info-item" id="sendsout"><span class="lable">成功发送：</span><span
                                    class="lable1" id="sendsnum2"></span>条<span class="lable">, 发送失败：</span><span
                                    class="lable2" id="sendsnum3"></span>条</div>
                            <div class="footer-btn">
                                <a class="salary-button primary seelogs" href="javascript:;" style="width: 130px;">查看发送记录</a>
                            </div>
                            <div class="content-item">
                                <div class="content-tip">员工如何查看工资条？</div>
                                <div class="content-text">
                                    <div>微信：员工先关注对应微信公众号，发送工资条后，通过微信查看工资条;</div>
                                    <div>短信：员工通过短信接收工资条，查看工资条;</div>
                                </div>
                                <div class="flex img-container"><!---->
                                    <div class="wx-img"><img src="{$weixin.image|default=''}">
                                        <div class="salary-button primary" style="font-size: 15px;">
                                            下载公众号二维码
                                        </div>
                                    </div>
                                    <div>
                                        <div class="tip3">下载后将二维码群发给同事<br>让同事可以通过微信查看工资条
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
            </div>

        </div>
    </div>
</div>
<input type="hidden" value="" id="save_name">
<input type="hidden" value="" id="save_price">
<input type="hidden" value="" id="save_type">
<input type="hidden" value="" id="save_time">
<input type="hidden" value="" id="save_phone">
<input type="hidden" value="" id="save_email">
<input type="hidden" value="" id="save_send">
<input type="hidden" value="" id="save_selected">
<input type="hidden" value="" id="save_gongao">
<input type="hidden" value="" id="save_dingshi">
<input type="hidden" value="" id="save_kongzhi">